<template>
    <div class="my-music">
        <div class="album-slide">
            <div class="album-img">
                <img :src="avator">
            </div>
            <ul class="album-info">
                <li>昵称：{{username}}</li>
                <li>性别：{{userSex}}</li>
                <li>年龄：{{birth}}</li>
                <li>地址：{{location}}</li>
                <li>余额：{{money}}</li>
            </ul>
        </div>
        <div class="album-content">
            <div class="album-title">
                个性签名：{{introduction}}
            </div>
            <div class="songs-body">
                <album-content-two :songList="collectList">
                    <template slot="title">我的订单</template>
                </album-content-two>
<!--              <AlbumContentTwo :songList="collectList">-->
<!--                <template slot="title">我的收藏</template>-->
<!--              </AlbumContentTwo>-->
            </div>
        </div>
    </div>
</template>

<script>
import {mixin} from '../mixins';
import {mapGetters} from 'vuex';
import AlbumContent from "../components/AlbumContent";
import AlbumContentTwo from "../components/AlbumContentTwo";
import {myLogin,usermation} from "../api/user";
import {inquireAboutYourOrder} from "../api/order";

export default {
    name: 'my-music',
    mixins: [mixin],
    components:{
        // AlbumContent,
      AlbumContentTwo
    },
    data(){
        return {
            // avator: '',       //用户头像
            username: '',     //昵称
            userSex: '',      //性别
            birth: '',        //生日
            location: '',     //故乡
            introduction: '', //签名
            money:0,
            collection: [],     //收藏的歌曲列表
            collectList: [],    //收藏的歌曲列表（带歌曲详情）
        }
    },
    computed:{
        ...mapGetters([
            'avator',
            'listOfSongs',      //当前播放列表
            'userId',           //当前登录用户id
        ])
    },
    mounted(){
        this.getMsg();
        // this.getCollection(this.userId);
    },
    methods:{
        getMsg(){
          usermation().then(res=>{
            this.username = res.data.obj.name;
            if(res.data.obj.sex==0){
              this.userSex = '女';
            }else if (res.data.obj.sex==1){
              this.userSex = '男';
            }
            this.birth = res.data.obj.age;
            this.location = res.data.obj.address;
            this.introduction = res.data.obj.intro;
            this.money = res.data.obj.money;
          }).catch(error=>{
            console.log(error)
          })
        },
    }
}
</script>

<style lang="scss" scoped>
@import '../assets/css/my-music.scss';
</style>
